import "./mask.css"
import { Button } from 'antd'
import React, { Component } from 'react'
import axios from "axios"

export default class mask extends Component {
    constructor(props) {
        super(props)
        this.state = {
            data: {}
        }
    }
    back() {
        this.props.cancel2.id = "hidden2"
    }
    //获取信息
    getInfo(ev) {
        let text = ev.target.value
        let arr = this.state.data
        this.setState({
            data: {
                ...arr,
                [ev.target.name]: text
            }
        })//非空验证
    }
    //提交信息
    async commit() {
        if (!this.state.data.sheng || !this.state.data.zong || !this.state.data.shou || !this.state.data.xiangmu || !this.state.data.zhou || !this.state.data.ren) {
            this.xiaoque.style = "display:block"
            this.kongli.style = "display:block"
            this.chali.style = "display:none"
            console.log(this.success)
            this.error.style = "display:block"

        } else {
            let res = await axios({
                url: "http://10.35.166.207:8088/quzeng",
                params: {
                    sheng: this.state.data.sheng,
                    zong: this.state.data.zong,
                    shou: this.state.data.shou,
                    xiangmu: this.state.data.xiangmu,
                    zhou: this.state.data.zhou,
                    ren: this.state.data.ren
                }
            })
            if (res.data == "dui") {
            this.xiaoque.style = "display:block"
            this.chali.style = "display:block"
            this.kongli.style = "display:none"
            this.error.style = "display:none"
            this.success.style = "display:block"
                this.setState({
                    data: {}
                })
                this.props.fn()
            }
        }

    }
    quxiaoxiao() {
        this.props.cancel2.id = "hidden2"
    }
    close() {
        this.xiaoque.style = "display:none"
    }
    render() {
        return (
            <div id="box1" >
                <div className="queren" ref={(ref) => { this.xiaoque = ref }}>
                    <div className="querenbox">
                        <li className="chali" ref={(ref) => { this.chali = ref }}>插入成功</li>
                        <li className="kongli" ref={(ref) => { this.kongli = ref }}>不能为空</li><br />
                        <div className="con" ref={(ref) => { this.success = ref }}>
                            <Button type='danger' onClick={() => this.quxiaoxiao()}>确认</Button>
                        </div>
                        <div className="con" ref={(ref) => { this.error = ref }}>
                            <Button type='danger' onClick={() => this.close()}>确认</Button>
                        </div>
                    </div>
                </div>

                <div id="pop">
                    <h2>添加投资信息</h2>
                    <div id="form" className="add">
                        <p>*省份：<input type="text" name="sheng" onChange={(ev) => this.getInfo(ev)} /></p>
                        <p>*投资总额：<input type="text" name="zong" onChange={(ev) => this.getInfo(ev)} /></p>
                        <p>*收益总额：<input type="text" name="shou" onChange={(ev) => this.getInfo(ev)} /></p>
                        <p>*主要投资项目：<input type="text" name="xiangmu" onChange={(ev) => this.getInfo(ev)} /></p>
                        <p>*投资周期：<input type="text" name="zhou" onChange={(ev) => this.getInfo(ev)} /></p>
                        <p>*投资人数：<input type="text" name="ren" onChange={(ev) => this.getInfo(ev)} /></p>


                        <p className="commit"><Button type="primary" className="button" onClick={() => this.commit()}>确定</Button><Button onClick={() => this.back()}>取消</Button></p>
                    </div>
                </div>
            </div>
        )
    }
}
